<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../../assets/iconfont/iconfont.css" />
    <link rel="stylesheet" href="./FileWarehouse.css" />
    <link rel="stylesheet" href="../../assets/common/common.css" />
  </head>
  <body>
    <div class="FileWarehouse">
      <!--頂部-->
      <header class="header">
        <a href="" class="icon-zuojiantou iconfont ml-15"></a>
        <div>文档库</div>
        <div class="icon-sousuo iconfont mr-15"></div>
      </header>

      <!--分类-->
      <div class="sort flex jc-sa aic sort">
        <a href="./My-files.html" class="aic fdc">
          <div class="icon-wenjianjia iconfont col1 f20"></div>
          <span class="mt-5">公共文件</span>
        </a>
        <a href="./My-files.html" class="aic fdc">
          <div class="icon-wodewenjianjia- iconfont col2 f20"></div>
          <span class="mt-5">我的文件</span>
        </a>
        <a href="./My-files.html" class="aic fdc">
          <div class="icon-w_gerenfenxiang iconfont col3 f20"></div>
          <span class="mt-5">分享给我的</span>
        </a>
        <a href="./My-files.html" class="aic fdc">
          <div class="icon-wodeshoucang iconfont col4 f20"></div>
          <span class="mt-5">我的收藏</span>
        </a>
      </div>
      <!--上传图标-->
      <div class="Upload-Icon">
        <div class="icon-tianjia1 iconfont Upload f30" onclick="Icon(1)"></div>
      </div>
      <!--隐藏的上传-->
      <div class="Hide-upload">
        <div class="dingwei">
          <div class="Hide-top">
            <div class="f12 span">请选择</div>
            <div class="f16 span1" onclick="Icon1(1)">上传文件</div>
            <div class="f16 span1" onclick="Icon(3)">上传文件夹</div>
          </div>

          <div class="Hide-buttom mt-10">
            <span class="f16" onclick="Icon(2)">取消</span>
          </div>
        </div>
      </div>
      <!--隐藏2-->
      <div class="Hide-upload">
      <div class="dingwei2">
        <div class="Hide-top">
          <div class="f16 span1" onclick="Icon1(2)">拍照</div>
          <div class="f16 span1" onclick="Icon1(2)">文件</div>
          <div class="f16 span1" onclick="Icon1(2)">相册</div>
        </div>

        <div class="Hide-buttom mt-10">
          <span class="f16" onclick="Icon1(2)">取消</span>
        </div>
      </div>
    </div>
    <!--隱藏3-->
     <div class="Hide-upload1">
            <div class="wenjian">
                <div class="f18 text">新建文件夾</div>
                <input class="input" type="text" placeholder="請輸入文件夾名稱">
                <div class="mt-20 button">
                    <div class="button1" onclick="Icon2(2)">取消</div>
                    <div class="button2" onclick="Icon2(1)">確定</div>
                </div> 
            </div>

    </div>
    <!--隐藏4-->  
    <!-- <div class="Hide-upload2">
      <div class="wenjian1">
        <div>成功</div>

      </div>

    </div> -->
      <!--主体-->
      <div class="flex">
            <a href="./archives.html" class="subject flex aic mt-20" >
                <div class="icon-word iconfont ml-10 f20 col4"></div>
                <div  class="ml-15 fdc jc-sa">
                    <div class="span flex jc-sb">
                        <span class="f14">吴珊珊的档案</span>
                        <span class="f12 span1">公共文件</span>
                    </div>
                    <div class="mt-10 f12">
                        <span class="span2">李凡凡 于 2022-01-09 10:45 上传</span>
                    </div>
                </div>
            </a>  
            
            <div class="icon-ai225 iconfont MoreActions" onclick="MoreActions()"></div>
         
        </div> 
    </div>
  </body>
  <script>
 // 点击上传图标
 // 第一層
  function Icon(item){
    var  a=document.querySelector('.dingwei')
    c=document.querySelector('.wenjian')
    if(item==1){
     a.style.display='block'

    }else if(item==2){
        a.style.display='none'
    }else if(item==3){
      a.style.display='none'
      c.style.display='block'
    }
    
  }
  // 第二層
  function Icon1(item){
    var  b=document.querySelector('.dingwei2')
    a=document.querySelector('.dingwei')
    c=document.querySelector('.wenjian')
    if(item==1){
        b.style.display='block'

    }else if(item==2){
        b.style.display='none'
        a.style.display='none'
  
      
       
    }
  }
  // 上傳文件
 function Icon2(item){
     var c=document.querySelector('.wenjian')
     b=document.querySelector('.dingwei2')
    a=document.querySelector('.dingwei')
     if(item==1){
      c.style.display='none'
     }else if(item==2){
        c.style.display='none'
     }
 }
  
  // 更多操作  
   function MoreActions(){
     alert()
   }

  </script>
</html>
